<jsp:directive.page contentType="text/html;charset=utf-8" />
<%@ include file="/taglibs.jsp" %>

<head>
<title>Select a Category</title>

</head>


<body>



<div class="row">
	<div class="span1"></div>
	<div class="span10">
		<div class="row">
			<div class="span5">
			<a href="javascript:void(0);" class="btn btn-large btn-block btn-primary disabled">Step 1: Select a Category</a></div>
			<div class="span5">
			<a href="javascript:void(0);" class="btn btn-large btn-block disabled">Step 2: Fill the information</a></div>
		</div>
		&nbsp;
		<div class="accordion" id="accordion2">
		<s:iterator value="catalog.childCategories" var="cat" >
		  <div class="accordion-group">
		    <div class="accordion-heading">
		      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#${nameEn}">
		        <strong><s:property value="name"/> | <s:property value="nameEn"/></strong>
		      </a>
		    </div>
		    <div id="${nameEn}" class="accordion-body collapse">
		      <div class="accordion-inner">
					<ul class="nav nav-list">				
							<s:iterator value="childCategories" var="category">
							 <li class="span2">
							 	<a class="" 
							 		href="${ctx}/trade!showFillInfoPage.action?category.id=<s:property value='#category.id'/>" 
							 		title="<s:property value='#category.name'/>">
							 		<s:property value="#category.name"/> | <s:property value="#category.nameEn"/></a>
							 </li>
							</s:iterator>
					</ul>
		      </div>
		    </div>
		  </div>
		</s:iterator>
		</div>

	</div>
	<div class="span1"></div>
</div>
<script>
	$(function() {
		$(".collapse").collapse();
	});
</script>
</body>
